<template>
	<view class="page-home">
		<!-- 顶部渐变区域 -->
		<view class="top-gradient-section">
			<view class="user-header">
				<view class="user-info">
					<image class="user-avatar" src="/static/gongzt/image@2x.png" mode="aspectFill"></image>
					<text class="user-name">{{ userName }}</text>
				</view>
				<view class="header-actions">
					<view class="action-icon">
						<image src="/static/gongzt/Frame.png" mode="aspectFit" class="icon-image"></image>
					</view>
					<view class="action-icon">
						<image src="/static/gongzt/Frame 1799@2x.png" mode="aspectFit" class="icon-image"></image>
					</view>
				</view>
			</view>

			<!-- 快捷功能区域 -->
			<view class="quick-actions-inline">
				<view class="action-item" @tap="goToTodayTasks">
					<view class="action-icon-wrapper">
						<image src="/static/gongzt/Group 1707487578@2x.png" mode="aspectFit" class="action-icon-image">
						</image>
						<view class="badge" v-if="statistics.today_todo_num > 0">{{ statistics.today_todo_num }}</view>
					</view>
					<text class="action-text">今日待办</text>
				</view>
				<view class="action-item" @tap="goToPendingActivities">
					<view class="action-icon-wrapper">
						<image src="/static/gongzt/Group 1707487579@2x.png" mode="aspectFit" class="action-icon-image">
						</image>
						<view class="badge" v-if="statistics.todo_num > 0">{{ statistics.todo_num }}</view>
					</view>
					<text class="action-text">待办活动</text>
				</view>
				<view class="action-item" @tap="goToActivityEntry">
					<view class="action-icon-wrapper">
						<image src="/static/gongzt/Group 1707487580@2x.png" mode="aspectFit" class="action-icon-image">
						</image>
					</view>
					<text class="action-text">活动录入</text>
				</view>
				<view class="action-item" @tap="goToInspectionEntry">
					<view class="action-icon-wrapper">
						<image src="/static/gongzt/Group 1707487581@2x.png" mode="aspectFit" class="action-icon-image">
						</image>
						<view class="badge" v-if="statistics.check_num > 0">{{ statistics.check_num }}</view>
					</view>
					<text class="action-text">巡检录入</text>
				</view>
			</view>

			<!-- 公告区域 -->
			<view class="announcement-section" @tap="viewAnnouncement">
				<view class="announcement-content">
					<text class="announcement-text">致全体员工的一封信,这是一条最新消息通知息通知...</text>
					<image src="/static/gongzt/Frame 1799@2x.png" mode="aspectFit" class="arrow-icon"></image>
				</view>
			</view>
		</view>

		<view class="elderly-section">
				<!-- 数据统计区域 -->
		<view class="stats-section">
			<view class="stat-item">
				<text class="stat-number">{{ statistics.member_num }}</text>
				<text class="stat-label">负责老人</text>
			</view>
			<view class="stat-item">
				<text class="stat-number">{{ statistics.medicine_num }}</text>
				<text class="stat-label">今日用药</text>
			</view>
			<view class="stat-item">
				<text class="stat-number">{{ statistics.todo_num }}</text>
				<text class="stat-label">待办活动</text>
			</view>
			<view class="stat-item" @tap="goToInspectionRecord">
				<text class="stat-number">{{ statistics.check_num }}</text>
				<text class="stat-label">巡检次数</text>
			</view>
		</view>

		<!-- 用药提醒卡片 -->
		<view class="medication-reminder">
			<view class="reminder-container" 
				@touchstart="handleTouchStart" 
				@touchmove="handleTouchMove" 
				@touchend="handleTouchEnd">
				<view class="reminder-content-wrapper" :style="reminderWrapperStyle">
					<view class="reminder-item" v-for="(reminder, index) in medicationReminders" :key="reminder.id">
						<view class="reminder-header">
							<text class="reminder-title">{{ reminder.title }}</text>
							<view class="due-tag">
								<text class="due-text">{{ reminder.status }}</text>
								<view class="time-box">{{ reminder.dueTime }}</view>
							</view>
						</view>
						<view class="reminder-content">
							<text class="reminder-text">{{ reminder.content }}</text>
						</view>
						<view class="reminder-actions">
							<button class="action-btn primary" @tap="confirmMedication">确认服药</button>
							<button class="action-btn secondary" @tap="uploadImage">上传图文</button>
							<button class="action-btn secondary" @tap="remindLater">延后提醒</button>
						</view>
					</view>
				</view>
			</view>
			<view class="reminder-dots">
				<view 
					class="dot" 
					:class="{ active: index === currentReminderIndex }"
					v-for="(reminder, index) in medicationReminders" 
					:key="reminder.id"
					@tap="goToReminder(index)"
				></view>
			</view>
		</view>

		<!-- 我的负责老人区域 -->
		<view class="elderly-section">
			<view class="section-header">
				<text class="section-title">我的负责老人</text>
			</view>
			<view class="elderly-list">
				<view class="elderly-card" v-for="(elder, index) in elderlyList" :key="index"
					@tap="viewElderDetail(elder)">
					<view class="elderly-header">
						<text class="elderly-name">姓名: {{ elder.name }}</text>
						<text class="elderly-status">{{ elder.status }}</text>
					</view>
					<view class="elderly-info">
						<view class="info-row">
							<text class="info-item">性别: {{ elder.gender }}</text>
							<text class="info-item">年纪: {{ elder.age }}</text>
							<text class="info-item">身份证号: {{ elder.idCard }}</text>
						</view>
						<view class="info-row">
							<text class="info-item">籍贯: {{ elder.hometown }}</text>
							<text class="info-item">婚姻状况: {{ elder.maritalStatus }}</text>
							<text class="info-item">既往病史: {{ elder.medicalHistory }}</text>
							<text class="info-item">过敏史: {{ elder.allergyHistory }}</text>
						</view>
					</view>
					<view class="elderly-actions">
						<button class="elderly-btn primary" @tap.stop="enterInformation(elder)">信息录入</button>
						<button class="elderly-btn secondary" @tap.stop="viewCareRecord(elder)">护理记录</button>
					</view>
				</view>
			</view>
		</view>
		</view>
	</view>
</template>

<script>
import { apiGetHomeStatistics } from '@/request/api.js'

export default {
	data() {
		return {
			// 统计数据
			statistics: {
				today_todo_num: 0,
				todo_num: 0,
				member_num: 0,
				check_num: 0,
				medicine_num: 0,
				msg: 0
			},
			// 加载状态
			loading: false,
			elderlyList: [
				{
					name: '陶玉成',
					status: '已入驻',
					gender: '男',
					age: '46',
					idCard: '341230022139382',
					hometown: '上海市',
					maritalStatus: '丧偶',
					medicalHistory: '神经病',
					allergyHistory: '无'
				},
				{
					name: '李奶奶',
					status: '已入驻',
					gender: '女',
					age: '78',
					idCard: '310101194501011234',
					hometown: '北京市',
					maritalStatus: '已婚',
					medicalHistory: '高血压',
					allergyHistory: '青霉素'
				},
				{
					name: '王爷爷',
					status: '已入驻',
					gender: '男',
					age: '82',
					idCard: '110101194201021234',
					hometown: '广州市',
					maritalStatus: '丧偶',
					medicalHistory: '糖尿病',
					allergyHistory: '无'
				}
			],
			medicationReminders: [
				{
					id: 1,
					title: '用药提醒',
					content: '张奶奶需要服用降压药 (每日2次,每次1片)',
					dueTime: '14:30',
					status: '即将逾期'
				},
				{
					id: 2,
					title: '用药提醒',
					content: '李爷爷需要服用降糖药 (每日3次,每次1片)',
					dueTime: '16:00',
					status: '即将逾期'
				},
				{
					id: 3,
					title: '用药提醒',
					content: '王奶奶需要服用维生素 (每日1次,每次2片)',
					dueTime: '18:30',
					status: '即将逾期'
				}
			],
			currentReminderIndex: 0,
			autoPlayTimer: null,
			touchStartX: 0,
			touchEndX: 0,
			reminderWrapperStyle: {
				transform: 'translateX(0)',
				transition: 'transform 0.3s ease-in-out'
			}
		}
	},
	onLoad() {
		// 页面加载时的初始化
		this.loadHomeData();
		this.startAutoPlay();
		this.updateReminderWrapperStyle(); // 初始化轮播样式
	},
	onUnload() {
		// 页面卸载时清除定时器
		this.stopAutoPlay();
	},
	onShow() {
		// 页面显示时刷新数据
		this.loadHomeData();
	},
	onPullDownRefresh() {
		// 下拉刷新
		this.loadHomeData().then(() => {
			uni.stopPullDownRefresh();
		});
	},
	computed: {
		currentReminder() {
			return this.medicationReminders[this.currentReminderIndex];
		},
		userName() {
			try {
				const userInfo = uni.getStorageSync('userInfo');
				if (userInfo) {
					// 优先使用昵称，然后是姓名，最后是手机号
					if (userInfo.nickname && userInfo.nickname.trim()) {
						return userInfo.nickname;
					}
					if (userInfo.name && userInfo.name.trim()) {
						return userInfo.name;
					}
					if (userInfo.phone && userInfo.phone.trim()) {
						return `用户${userInfo.phone}`;
					}
				}
				return '用户WTS4.0';
			} catch (e) {
				return '用户WTS4.0';
			}
		}
	},
	methods: {
		// 加载首页数据
		async loadHomeData() {
			try {
				this.loading = true;
				const params = {
					uid : '33897'
				}
				const response = await apiGetHomeStatistics(params);
				
				if (response.code === 0 && response.data) {
					// 更新统计数据
					this.statistics = {
						today_todo_num: response.data.statistics.today_todo_num || 0,
						todo_num: response.data.statistics.todo_num || 0,
						member_num: response.data.statistics.member_num || 0,
						check_num: response.data.statistics.check_num || 0,
						medicine_num: response.data.statistics.medicine_num || 0,
						msg: response.data.statistics.msg || 0
					};
					
					// 更新老人列表 - 过滤掉空数据
					if (response.data.member && response.data.member.length > 0) {
						this.elderlyList = response.data.member
							.filter(member => member.name && member.id) // 过滤掉空数据
							.map(member => ({
								id: member.id,
								name: member.name,
								status: member.status === 1 ? '已入驻' : '未入驻',
								gender: member.sex === 0 ? '女' : '男',
								age: this.calculateAge(member.birthday),
								idCard: member.id_num || '未填写',
								hometown: `${member.province || ''}${member.city || ''}${member.area || ''}`.trim() || '未填写',
								maritalStatus: this.getMaritalStatus(member.marray),
								medicalHistory: member.history || '无',
								allergyHistory: member.mi_history || '无',
								phone: member.phone || '',
								photo: member.photo || '/static/gongzt/image@2x.png'
							}));
					}
					
					// 更新用药提醒 - 从event数据中筛选用药类型
					if (response.data.event && response.data.event.length > 0) {
						const medicationEvents = response.data.event
						this.medicationReminders = medicationEvents.slice(0, 10000).map((event, index) => ({
							id: event.id,
							title: '用药提醒',
							content: `${event.name} 需要${event.title} (${event.num_desc})`,
							dueTime: this.formatTime(event.event_time),
							status: this.getEventStatus(event.event_time)
						}));
						console.log(this.medicationReminders);
					}
				}
			} catch (error) {
				console.error('加载首页数据失败:', error);
				uni.showToast({
					title: '数据加载失败',
					icon: 'none'
				});
			} finally {
				this.loading = false;
			}
		},
		
		// 计算年龄
		calculateAge(birthday) {
			if (!birthday || birthday === '0000-00-00') return '未知';
			const birth = new Date(birthday);
			const today = new Date();
			let age = today.getFullYear() - birth.getFullYear();
			const monthDiff = today.getMonth() - birth.getMonth();
			if (monthDiff < 0 || (monthDiff === 0 && today.getDate() < birth.getDate())) {
				age--;
			}
			return age > 0 ? age.toString() : '未知';
		},
		
		// 获取婚姻状况
		getMaritalStatus(marray) {
			switch (marray) {
				case 1: return '未婚';
				case 2: return '已婚';
				case 3: return '离异';
				case 4: return '丧偶';
				default: return '未知';
			}
		},
		
		// 格式化时间
		formatTime(timeString) {
			if (!timeString) return '';
			const date = new Date(timeString);
			return `${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`;
		},
		
		// 获取事件状态
		getEventStatus(eventTime) {
			if (!eventTime) return '待处理';
			const now = new Date();
			const eventDate = new Date(eventTime);
			const diffMinutes = (eventDate - now) / (1000 * 60);
			
			if (diffMinutes < 0) return '已逾期';
			if (diffMinutes < 30) return '即将逾期';
			return '待处理';
		},
		
		// 自动轮播相关
		startAutoPlay() {
			this.autoPlayTimer = setInterval(() => {
				this.nextReminder();
			}, 5000); // 每5秒切换一次
		},
		stopAutoPlay() {
			if (this.autoPlayTimer) {
				clearInterval(this.autoPlayTimer);
				this.autoPlayTimer = null;
			}
		},
		pauseAutoPlay() {
			this.stopAutoPlay();
		},
		resumeAutoPlay() {
			this.startAutoPlay();
		},
		// 快捷功能跳转
		goToTodayTasks() {
			uni.navigateTo({
				url: '/pages/activities/activities'
			});
		},
		goToPendingActivities() {
			uni.navigateTo({
				url: '/pages/pendingActivities/pendingActivities'
			});
		},
		goToActivityEntry() {
			uni.navigateTo({
				url: '/pages/activityEntry/activityEntry'
			});
		},
		goToInspectionEntry() {
			uni.navigateTo({
				url: '/pages/inspectionEntry/inspectionEntry'
			});
		},
		goToInspectionRecord() {
			uni.navigateTo({
				url: '/pages/inspectionRecord/inspectionRecord'
			});
		},
		
		// 公告相关
		viewAnnouncement() {
			uni.showToast({
				title: '查看公告详情',
				icon: 'none'
			});
		},
		
		// 用药提醒相关
		confirmMedication() {
			uni.showToast({
				title: '已确认服药',
				icon: 'success'
			});
		},
		uploadImage() {
			uni.showToast({
				title: '上传图文功能',
				icon: 'none'
			});
		},
		remindLater() {
			uni.showToast({
				title: '已延后提醒',
				icon: 'success'
			});
		},
		
		// 轮播相关
		nextReminder() {
			this.currentReminderIndex = (this.currentReminderIndex + 1) % this.medicationReminders.length;
			this.updateReminderWrapperStyle();
		},
		prevReminder() {
			this.currentReminderIndex = this.currentReminderIndex === 0 
				? this.medicationReminders.length - 1 
				: this.currentReminderIndex - 1;
			this.updateReminderWrapperStyle();
		},
		goToReminder(index) {
			this.currentReminderIndex = index;
			this.updateReminderWrapperStyle();
			// 点击时暂停自动轮播，3秒后恢复
			this.pauseAutoPlay();
			setTimeout(() => {
				this.resumeAutoPlay();
			}, 3000);
		},
		updateReminderWrapperStyle() {
			const translateX = -this.currentReminderIndex * 100;
			this.reminderWrapperStyle = {
				transform: `translateX(${translateX}%)`,
				transition: 'transform 0.3s ease-in-out'
			};
		},
		
		// 老人管理相关
		viewElderDetail(elder) {
			// 跳转到老人详情页面，传递老人ID
			uni.navigateTo({
				url: `/pages/elderlyDetails/elderlyDetails?member_id=${elder.id}&member_name=${encodeURIComponent(elder.name)}`
			});
		},
		enterInformation(elder) {
			// 跳转到信息录入页面，传递老人ID
			uni.navigateTo({
				url: `/pages/infoEntry/infoEntry?member_id=${elder.id}&member_name=${encodeURIComponent(elder.name)}`
			});
		},
		viewCareRecord(elder) {
			// 跳转到护理记录页面，传递老人ID
			uni.navigateTo({
				url: `/pages/careRecord/careRecord?id=${elder.id}&member_name=${encodeURIComponent(elder.name)}`
			});
		},

		// 用药提醒卡片触摸事件
		handleTouchStart(event) {
			this.touchStartX = event.touches[0].clientX;
			this.pauseAutoPlay(); // 触摸时暂停自动轮播
		},
		handleTouchMove(event) {
			this.touchEndX = event.touches[0].clientX;
			// 添加实时滑动效果
			const deltaX = this.touchEndX - this.touchStartX;
			const translateX = -this.currentReminderIndex * 100 + (deltaX / 100);
			this.reminderWrapperStyle = {
				transform: `translateX(${translateX}%)`,
				transition: 'none' // 滑动时禁用过渡动画
			};
		},
		handleTouchEnd() {
			const deltaX = this.touchEndX - this.touchStartX;
			const threshold = 50; // 滑动阈值

			if (deltaX > threshold && this.currentReminderIndex > 0) {
				this.prevReminder();
			} else if (deltaX < -threshold && this.currentReminderIndex < this.medicationReminders.length - 1) {
				this.nextReminder();
			} else {
				// 如果没有达到阈值，回到当前位置
				this.updateReminderWrapperStyle();
			}
			
			// 3秒后恢复自动轮播
			setTimeout(() => {
				this.resumeAutoPlay();
			}, 3000);
		}
	}
}
</script>

<style lang="scss" scoped>
.page-home {
	min-height: 100vh;
	background: #F8F8F8;
	padding-bottom: 10rpx;
}

.top-gradient-section {
	background: linear-gradient(255deg, #FF4856 12.1%, #FF6F1C 79.17%);
	padding: 60rpx 30rpx 40rpx;
	color: #FFFFFF;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.user-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin-bottom: 40rpx;
}

.user-info {
	display: flex;
	align-items: center;
}

.user-avatar {
	width: 80rpx;
	height: 80rpx;
	border-radius: 50%;
	margin-right: 20rpx;
	background-color: #FFFFFF;
}

.user-name {
	font-size: 32rpx;
	font-weight: 500;
	color: #FFFFFF;
}

.header-actions {
	display: flex;
	align-items: center;
	gap: 20rpx;
}

.action-icon {
	width: 60rpx;
	height: 60rpx;
	display: flex;
	align-items: center;
	justify-content: center;
}

.icon-image {
	width: 40rpx;
	height: 40rpx;
}

.quick-actions-inline {
	display: flex;
	justify-content: space-around;
	padding: 30rpx 0;
	width: 100%;
	margin-bottom: 30rpx;

}

.action-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	position: relative;
}

.action-icon-wrapper {
	width: 100rpx;
	height: 100rpx;
	background: linear-gradient(180deg, #FFF 34.48%, #FFAEAF 100%);
	border-radius: 16rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 16rpx;
	position: relative;
	backdrop-filter: blur(10rpx);
}

.action-icon-image {
	width: 80rpx;
	height: 80rpx;
}

.badge {
	position: absolute;
	top: -8rpx;
	right: -8rpx;
	background: #E60012;
	color: #FFFFFF;
	font-size: 20rpx;
	min-width: 32rpx;
	height: 32rpx;
	border-radius: 16rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 8rpx;
}

.action-text {
	color: #ffffff;
	font-family: "PingFang SC";
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

.announcement-section {
	width: 100%;
	height: 84rpx;
	border-radius: 12rpx;
	background: rgba(255, 255, 255, 0.15);
	border: 1rpx solid rgba(255, 255, 255, 0.3);
	display: flex;
	align-items: center;
	justify-content: center;
	backdrop-filter: blur(10rpx);
	box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
}

.announcement-content {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 0 24rpx;
}

.announcement-text {
	flex: 1;
	font-size: 26rpx;
	color: #FFFFFF;
	line-height: 1.4;
}

.arrow-icon {
	width: 32rpx;
	height: 32rpx;
}

.stats-section {
	display: flex;
	justify-content: space-around;
	padding: 20rpx;
	margin-bottom: 20rpx;
	background: #FFFFFF;
	border-radius: 16rpx;
	margin: 20rpx;
	box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
}

.stat-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	flex: 1;
}

.stat-number {
	font-size: 36rpx;
	font-weight: bold;
	color: #E60012;
	margin-bottom: 8rpx;
}

.stat-label {
	font-size: 22rpx;
	color: #666666;
}

.medication-reminder {
	margin: 0 20rpx 20rpx;
	background: linear-gradient(135deg, #FFE5E5 0%, #FFF5F5 100%);
	border-radius: 16rpx;
	padding: 30rpx;
	box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
	border: 1rpx solid #FFE5E5;
}

.reminder-container {
	overflow: hidden;
	border-radius: 12rpx;
	position: relative;
}

.reminder-content-wrapper {
	display: flex;
	transition: transform 0.3s ease-in-out;
	width: 100%;
}

.reminder-item {
	flex: 0 0 100%;
	min-width: 100%;
	padding: 0 20rpx;
	box-sizing: border-box;
}

.reminder-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20rpx;
}

.reminder-title {
	font-size: 32rpx;
	font-weight: bold;
	color: #333333;
}

.due-tag {
	background: #FFF2E6;
	border: 1rpx solid #FF7D00;
	border-radius: 12rpx;
	padding: 8rpx 16rpx;
	display: flex;
	align-items: center;
}

.due-text {
	font-size: 22rpx;
	color: #FF7D00;
	margin-right: 8rpx;
}

.time-box {
	background: #FF7D00;
	color: #FFFFFF;
	font-size: 22rpx;
	font-weight: bold;
	padding: 4rpx 12rpx;
	border-radius: 8rpx;
}

.reminder-content {
	margin-bottom: 30rpx;
}

.reminder-text {
	font-size: 28rpx;
	color: #333333;
	line-height: 1.4;
}

.reminder-actions {
	display: flex;
	gap: 20rpx;
	margin-bottom: 20rpx;
}

.action-btn {
	flex: 1;
	height: 70rpx;
	border-radius: 12rpx;
	font-size: 26rpx;
	border: none;
	transition: all 0.2s ease;
}

.action-btn.primary {
	background: #FF7D00;
	color: #FFFFFF;
}

.action-btn.primary:active {
	background: #E66A00;
	transform: scale(0.98);
}

.action-btn.secondary {
	background: #FFFFFF;
	color: #FF7D00;
	border: 1rpx solid #FF7D00;
}

.action-btn.secondary:active {
	background: #FFF5F0;
	transform: scale(0.98);
}

.reminder-dots {
	display: flex;
	justify-content: center;
	gap: 12rpx;
	margin-top: 20rpx;
}

.dot {
	width: 12rpx;
	height: 12rpx;
	border-radius: 50%;
	background: #E0E0E0;
	cursor: pointer;
	transition: all 0.3s ease;
}

.dot.active {
	background: #FF7D00;
	transform: scale(1.2);
}

.dot:hover {
	background: #FFB366;
}

.dot:active {
	transform: scale(0.9);
}

.elderly-section {
	padding: 0 16rpx;
	background-color: #FFF;
}

.section-header {
	margin-bottom: 20rpx;
	padding: 20rpx 0;
}

.section-title {
	font-size: 32rpx;
	font-weight: bold;
	color: #333333;
}

.elderly-list {
	display: flex;
	flex-direction: column;
	gap: 16rpx;
}

.elderly-card {
	background: #FFFFFF;
	border-radius: 12rpx;
	padding: 24rpx 24rpx 100rpx 24rpx;
	box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.08);
	border: 1rpx solid #F0F0F0;
	position: relative;
}

.elderly-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 16rpx;
}

.elderly-name {
	font-size: 28rpx;
	font-weight: bold;
	color: #333333;
}

.elderly-status {
	font-size: 22rpx;
	color: #007AFF;
	background: rgba(0, 122, 255, 0.1);
	padding: 4rpx 12rpx;
	border-radius: 6rpx;
}

.elderly-info {
	margin-bottom: 24rpx;
}

.info-row {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 8rpx;
}

.info-item {
	font-size: 24rpx;
	color: #666666;
	margin-right: 24rpx;
	margin-bottom: 6rpx;
	flex: 1;
	min-width: 200rpx;
}

.elderly-actions {
	display: flex;
	gap: 16rpx;
	justify-content: flex-end;
	position: absolute;
	bottom: 24rpx;
	right: 24rpx;
	width: auto;
}

.elderly-btn {
	// width: 120rpx;
	height: 64rpx;
	border-radius: 8rpx;
	font-size: 24rpx;
	border: none;
	font-weight: 500;
}

.elderly-btn.primary {
	background: #FF7D00;
	color: #FFFFFF;
}

.elderly-btn.secondary {
	background: #FFFFFF;
	color: #FF7D00;
	border: 1rpx solid #FF7D00;
}
</style>